<template>
	<view class="info">
		<!-- <view class="status-bar"></view> -->
		<!--  状态栏高度 -->
		
		<!-- 图表 -->
		<view class="ech">
		<view class="box">
			<view class="charts-box">
		<qiun-data-charts type="line" :opts="{dataLabel:false}" :chartData="chartsDataColumn1" :canvas2d="true" canvasId="componentsinit"  />
			</view>
		</view>
		</view>
		
		<!-- 日理论收益 -->
		<view class="box2">	
		<image src="../../static/info/m.png" mode=""></image>
		<h3>日益理论收益</h3>
		<infoSy></infoSy>
		</view>
		
		
		
		<!-- 挖矿信息 -->
		<view class="box2">
			<image src="../../static/info/msg.png" mode=""></image>
			<h3>挖矿信息</h3>
			<wkmsg></wkmsg>
		</view>
		
		<!-- 全网状态 -->
		<view class="box3">
			<image src="../../static/info/area.png" mode=""></image>
			<h3>全网状态</h3>
			<view class="status"><view class="sleft">全网难度</view><view class="sright">{{diff}}T</view></view>
		</view>
	</view>
</template>

<script>
// import homesList from '../../components/homes-list/homes-list.vue'
import selects from '../../components/infoSy/infoSy.vue'
import wkmsg from '../../components/wkmsg/wkmsg.vue'
	export default{
		components:{
			homesList,
			selects,
			wkmsg
		},
		name:'info',
		data(){
			return{
				list:'',
				chartsDataColumn1: {},
				diff:'13.36',
				
			}
		},
		methods:{
			getServerData() {
			  var ls={"categories": ["12.6", "12.7", "12.8", "12.9", "12.10", "12.11"],
			  "series": [{
			  	"name": "目标值",
			  	"data": [13, 3, 1, 3, 21, 30]
			  },]}
			  this.chartsDataColumn1=ls;
			},
		},
		created() {
			
		},
		mounted() {
			 this.getServerData()
		},
		onLoad: function (option) {
		  let list=JSON.parse(JSON.parse(option.list))
			 console.log(list);
			this.list=list
		}
	}
</script>

<style scoped>
	
	.charts-box{
		width: 94%;
		height: 340rpx;
		margin: auto;
		margin-top: 30rpx;
	}
	.ech{
		width: 100%;
		height: 300rpx;
		margin-bottom: 50rpx;
	}
	.dizhi{
		margin-left: 40rpx;
	}
	.dizhis{
		opacity: .4;
	}
	.clone{
		width: 40rpx;
		height: 40rpx;
		float: right;
		margin-right: 60rpx;
		border-radius: 50%;
	}
	h3{
		margin-left: 70rpx;
		margin-bottom: 20rpx;
	}
	.box2>image{
		width: 36rpx;
		height: 36rpx;
		position: relative;
		top: 50rpx;
		left: 20rpx;
	}
	
	.box3>image{
		width: 36rpx;
		height: 36rpx;
		position: relative;
		top: 50rpx;
		left: 20rpx;
	}
	.status{
		width: 94%;
		margin: auto;
		display: flex;
		justify-content: space-between;
		background-color: #FFFFFF;
		border-radius: 16rpx;
		padding: 6rpx;
	}
	.sleft{
		/* float: left; */
		margin-left: 10rpx 0;
		opacity: .7;
	}
	.sright{
		/* float: right; */
		font-size: 1em;
	}
</style>
